<article id="wikiArticle">
<div>
<div>
<div></div>
</div>
</div>
<p><strong><code>parseFloat()</code> </strong>函数解析一个字符串参数并返回一个浮点数。</p>
<div><iframe class="interactive interactive-js" frameborder="0" height="250" src="https://interactive-examples.mdn.mozilla.net/pages/js/globalprops-parsefloat.html" width="100%"></iframe></div>
<h2 id="语法">语法</h2>
<pre><code class="language-javascript">parseFloat(<em>value</em>)</code></pre>
<h3 id="参数">参数</h3>
<dl>
<dt><code>value</code></dt>
<dd>需要被解析成为浮点数的值。</dd>
</dl>
<h3 id="返回值">返回值</h3>
<dl>
<dd>给定值被解析成浮点数。如果给定值不能被转换成数值，则会返回 <a href="Reference/Global_Objects/NaN" title="全局属性 NaN 的值表示不是一个数字（Not-A-Number）。"><code>NaN</code></a>。</dd>
</dl>
<p> </p>
<h2 id="描述">描述</h2>
<p><code>parseFloat</code>是个全局函数,不属于任何对象.</p>
<p><code>parseFloat</code>将它的字符串参数解析成为浮点数并返回.如果在解析过程中遇到了正负号(+或-),数字(0-9),小数点,或者科学记数法中的指数(e或E)以外的字符,则它会忽略该字符以及之后的所有字符,返回当前已经解析到的浮点数.同时参数字符串首位的空白符会被忽略.</p>
<p>如果参数字符串的第一个字符不能被解析成为数字,<code>则parseFloat</code>返回<code>NaN</code>.</p>
<p>你可以通过调用<span style="line-height: 19.0909080505371px;"><a href="Reference/Global_Objects/isNaN" title="isNaN() 函数用来确定一个值是否为NaN 。注：isNaN函数内包含一些非常有趣的规则；你也可以通过ECMAScript 2015/ES6 中定义的Number.isNaN()或者 可以使用typeof 来判断该值是否为一个非数字。"><code>isNaN</code></a></span>函数来判断<code>parseFloat的返回结果是否是</code><code>NaN</code>.如果<code>让NaN</code>作为了任意数学运算的操作数,则运算结果必定也是<code>NaN</code>.</p>
<p><code>parseFloat</code><span> 也可转换和返回</span><code>Infinity值</code><span>. 可以使用<a href="Reference/Global_Objects/isFinite" title="该全局 isFinite() 函数用来判断被传入的参数值是否为一个有限数值（finite number）。在必要情况下，参数会首先转为一个数值。"><code>isFinite</code></a> 函数来判断结果是否是一个有限的数值 (非</span><code>Infinity</code><span>, </span><code>-Infinity</code><span>, 或 </span><code>NaN</code><span>).</span></p>
<p><code>parseFloat</code> 也可以转换一个已经定义了 <code>toString</code> 或者 <code>valueOf</code> 方法的对象，它返回的值和在调用该方法的结果上调用 <code>parseFloat</code> 值相同。</p>
<h2 id="例子">例子</h2>
<h3 id="例子_parseFloat返回正常数字">例子: <code>parseFloat</code>返回正常数字</h3>
<p>下面的例子都返回<strong>3.14</strong></p>
<pre><code class="language-js">parseFloat("3.14");
parseFloat("314e-2");
parseFloat("0.0314E+2");
parseFloat("3.14more non-digit characters");
</code></pre>
<h3 id="例子_parseFloat返回NaN">例子: <code>parseFloat</code>返回NaN</h3>
<p>下面的例子将返回<code>NaN</code></p>
<pre><code  class="language-javascript">parseFloat("FF2");
</code></pre>
<h3 id="更严格的转换函数">更严格的转换函数</h3>
<p>该函数通过正则表达式的方式,在需要更严格地转换float值时可能会有用:</p>
<pre><code  class="language-javascript">var filterFloat = function (value) {
    if(/^(\-|\+)?|(\.\d+)(\d+(\.\d+)?|(\d+\.)|Infinity)$/
      .test(value))
      return Number(value);
  return NaN;
}

console.log(filterFloat('421'));               // 421
console.log(filterFloat('-421'));              // -421
console.log(filterFloat('+421'));              // 421
console.log(filterFloat('Infinity'));          // Infinity
console.log(filterFloat('1.61803398875'));     // 1.61803398875
console.log(filterFloat('421e+0'));            // 421
console.log(filterFloat('421hop'));            // NaN
console.log(filterFloat('hop1.61803398875'));  // NaN
console.log(filterFloat("999 888"));           // NaN
console.log(filterFloat('.421'));              // 0.421
console.log(filterFloat('421.'));              // 421</code></pre>
<p>注意上面的代码只是示例。</p>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>ECMAScript 1st Edition.</td>
<td>Standard</td>
<td>Initial definition.</td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/5.1/#sec-15.1.2.3" hreflang="en" lang="en" rel="noopener">ECMAScript 5.1 (ECMA-262)<br/><small lang="zh-CN">parseFloat</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
<tr>
<td><a class="external" href="https://www.ecma-international.org/ecma-262/6.0/#sec-parsefloat-string" hreflang="en" lang="en" rel="noopener">ECMAScript 2015 (6th Edition, ECMA-262)<br/><small lang="zh-CN">parseFloat</small></a></td>
<td><span class="spec-Standard">Standard</span></td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<p></p><div class="bc-data"><a class="bc-github-link external" href="https://github.com/mdn/browser-compat-data" rel="noopener">Update compatibility data on GitHub</a><table class="bc-table bc-table-js"><thead><tr class="bc-platforms"><td></td><th class="bc-platform-desktop" colspan="6"><span>Desktop</span></th><th class="bc-platform-mobile" colspan="7"><span>Mobile</span></th><th class="bc-platform-server" colspan="1"><span>Server</span></th></tr><tr class="bc-browsers"><td></td><th class="bc-browser-chrome"><span class="bc-head-txt-label bc-head-icon-chrome">Chrome</span></th><th class="bc-browser-edge"><span class="bc-head-txt-label bc-head-icon-edge">Edge</span></th><th class="bc-browser-firefox"><span class="bc-head-txt-label bc-head-icon-firefox">Firefox</span></th><th class="bc-browser-ie"><span class="bc-head-txt-label bc-head-icon-ie">Internet Explorer</span></th><th class="bc-browser-opera"><span class="bc-head-txt-label bc-head-icon-opera">Opera</span></th><th class="bc-browser-safari"><span class="bc-head-txt-label bc-head-icon-safari">Safari</span></th><th class="bc-browser-webview_android"><span class="bc-head-txt-label bc-head-icon-webview_android">Android webview</span></th><th class="bc-browser-chrome_android"><span class="bc-head-txt-label bc-head-icon-chrome_android">Chrome for Android</span></th><th class="bc-browser-edge_mobile"><span class="bc-head-txt-label bc-head-icon-edge_mobile">Edge Mobile</span></th><th class="bc-browser-firefox_android"><span class="bc-head-txt-label bc-head-icon-firefox_android">Firefox for Android</span></th><th class="bc-browser-opera_android"><span class="bc-head-txt-label bc-head-icon-opera_android">Opera for Android</span></th><th class="bc-browser-safari_ios"><span class="bc-head-txt-label bc-head-icon-safari_ios">Safari on iOS</span></th><th class="bc-browser-samsunginternet_android"><span class="bc-head-txt-label bc-head-icon-samsunginternet_android">Samsung Internet</span></th><th class="bc-browser-nodejs"><span class="bc-head-txt-label bc-head-icon-nodejs">Node.js</span></th></tr></thead><tbody><tr><th scope="row"><code>parseFloat</code></th><td class="bc-supports-yes bc-browser-chrome"><span class="bc-browser-name">Chrome</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-edge"><span class="bc-browser-name">Edge</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-firefox"><span class="bc-browser-name">Firefox</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              1</td><td class="bc-supports-yes bc-browser-ie"><span class="bc-browser-name">IE</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-opera"><span class="bc-browser-name">Opera</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-safari"><span class="bc-browser-name">Safari</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-webview_android"><span class="bc-browser-name">WebView Android</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-chrome_android"><span class="bc-browser-name">Chrome Android</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-edge_mobile"><span class="bc-browser-name">Edge Mobile</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-firefox_android"><span class="bc-browser-name">Firefox Android</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              4</td><td class="bc-supports-yes bc-browser-opera_android"><span class="bc-browser-name">Opera Android</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-safari_ios"><span class="bc-browser-name">Safari iOS</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-samsunginternet_android"><span class="bc-browser-name">Samsung Internet Android</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td><td class="bc-supports-yes bc-browser-nodejs"><span class="bc-browser-name">nodejs</span><abbr class="bc-level-yes only-icon" title="Full support">
<span>Full support</span>
</abbr>
              Yes</td></tr></tbody></table><section class="bc-legend" id="sect1"><h3 class="offscreen" id="Legend">Legend</h3><dl><dt><span class="bc-supports-yes bc-supports">
<abbr class="bc-level bc-level-yes only-icon" title="Full support">
<span>Full support</span>
                  
                </abbr></span></dt><dd>Full support</dd></dl></section></div><p></p>
<h2 id="See_Also" name="See_Also">相关链接</h2>
<ul>
<li><a href="Reference/Global_Objects/parseInt" title="parseInt() 函数解析一个字符串参数，并返回一个指定基数的整数 (数学系统的基础)。"><code>parseInt()</code></a></li>
<li><a href="Reference/Global_Objects/Number/parseFloat" title="Number.parseFloat() 方法可以把一个字符串解析成浮点数。该方法与全局的 parseFloat() 函数相同，并且处于 ECMAScript 6 规范中（用于全局变量的模块化）。"><code>Number.parseFloat()</code></a></li>
<li><a href="Reference/Global_Objects/Number/parseInt" title="Number.parseInt() 方法可以根据给定的进制数把一个字符串解析成整数。"><code>Number.parseInt()</code></a></li>
<li><a href="Reference/Global_Objects/isNaN" title="isNaN() 函数用来确定一个值是否为NaN 。注：isNaN函数内包含一些非常有趣的规则；你也可以通过ECMAScript 2015/ES6 中定义的Number.isNaN()或者 可以使用typeof 来判断该值是否为一个非数字。"><code>isNaN()</code></a></li>
</ul>
</article>